<template>
<div>
  <el-form
      :model="user"
      ref="user"
      :rules="rule"
  >
    <el-form-item label="账号&nbsp;&nbsp;" prop="account" style="width: 80%">
      <el-input v-model="user.accountNo" placeholder="请输入" disabled
                style="position: relative ;left: 13px ; width:756px "></el-input>
    </el-form-item>
    <el-form-item label="奖项名称" prop="awardName" style="width: 50%">
      <el-input @change="openUpload()" v-model="user.awardName" placeholder="请输入奖项名称"></el-input>
    </el-form-item>
    <el-form-item label="指导老师" prop="teacher" style="width: 50%">
      <el-input v-model="user.teacher" placeholder="请输入指导老师"></el-input>
    </el-form-item>
    <el-form-item label="奖项等级" prop="awardLevel" style="width: 50%">
      <el-input v-model="user.awardLevel" placeholder="请写奖项等级(例：一等奖、二等奖)"></el-input>
    </el-form-item>
    <el-form-item prop="awardData" label="获奖日期">
      <el-date-picker
          v-model="user.awardData"
          type="date"
          placeholder="请选择日期"
          clearable
      />
    </el-form-item>
    <el-form-item label="奖项类型" prop="competitionTypeNo">
      <el-select
          v-model="user.competitionTypeNo"
          placeholder="请选择奖项类型"
          style="width: 50%"
      >
        <el-option
            v-for="x in allAwardGrade.grade"
            :key="x.competitionTypeNo"
            :label="x.competitionTypeName"
            :value="x.competitionTypeNo"
        />
      </el-select>
    </el-form-item>
    <el-upload
        accept=".jpeg,.png,.jpg"
        :before-upload="checkFileType"
        :headers="this.headerObject"
        id="uploadShowOrHide"
        v-model="showUpload"
        v-if="showUpload"
        class="upload-demo"
        drag
        :action="serverIp + '/api/info_award/uploadSign'"
        limit="1"
        :on-success="getFileNo"
    >
      <el-icon class="el-icon--upload">
        <upload-filled /></el-icon>
      <div class="el-upload__text">
        将文件移在这 或 <em>点击上传</em>
      </div>
      <template #tip>
        <div class="el-upload__tip">
          jpeg/jpg/png 文件应小于 10MB
        </div>
      </template>
    </el-upload>
    <el-form-item>
      <el-button type="primary" @click="update('user');">提交</el-button>
      <el-button @click="goBack('user')">取消</el-button>
    </el-form-item>
  </el-form>
</div>
</template>


<script>
import Information from "@/template/Information.vue";
import {serverIp} from "../../../public/static/config.js";
import request from "@/util/request.js";
import aes from "@/util/aes.js";


export default {
  components: {Information},
  data(){
  return{
    serverIp: serverIp, //附件上传路径
    showUpload : false,
    lookUpdate : false,
    getNo:{},
    headerObject:{
      "account" : JSON.parse(localStorage.getItem('user')).accountNo,
      "token" : JSON.parse(localStorage.getItem('user')).token
    },
    user: {
      classNo:"",
      awardName : "",
      accountNo: "",
      teacher: "",
      awardData: "",
      awardLevel: "",
      fileNo :"",
      competitionTypeNo :"",
      awardNo:"",
      id:"",
      },
    allAwardGrade: {
      grade: [],
      },
    rule: {
      awardName: [
        { required: true, message: '请输入奖项名称', trigger: 'blur' },
      ],
      awardLevel:[
        { required: true, message: '请输入奖项等级', trigger: 'blur' },
      ],
      awardData: [
        { type: 'date', required: true, message: '请选择获奖日期', trigger: 'change' }
      ],
      competitionTypeNo: [
        { required: true, message: '请选择奖项类型', trigger: 'blur' }
      ],
    },
    }
  },
  //初始方法
  created() {
    //获取所有奖项等级
    this.getAllAwardGrade();
    //获得当前用户的AccountNo
    this.getAccountNo();
    //获取classNo
    this.getClassNo();
  },
  methods:{
    // 检查文件类型
    checkFileType(file) {
      const fileName = file.name
      const fileType = fileName.substring(fileName.lastIndexOf('.'))
      // jpeg,.png,.jpg,.bmp,.gif
      if (
          fileType === '.jpg' ||
          fileType === '.png' ||
          fileType === '.jpeg'
      ) {
        // 不处理
      } else {
        this.$message.error(
            '不是,jpeg,.png,.jpg文件,请上传正确的图片类型'
        )
        return false
      }
    },
    update(val){
      this.$refs[val].validate((valid) => {
        if (valid) {
          request.post("/info_award/edit", this.user).then(res => {
            if (res.data.code === '200') {
              this.$alert('提交成功', '提交成功', {
                confirmButtonText: '确定',
              }).then(() => {
                location.reload()
              });
            }
          })
        }
      })
    },
    getAllAwardGrade(){
      request.get("/competition/all").then(res => {
        if (res.data.code === '200') {
          this.allAwardGrade.grade = res.data.data
          }
        })
    },
    goBack(){
      this.user.awardName = ""
      this.user.awardLevel = ""
      this.user.awardData = ""
      this.user.teacher = ""
      this.user.competitionTypeNo = ""
    },

    //获取accountNo
    getAccountNo(){
      this.user.accountNo = JSON.parse(localStorage.getItem('user')).accountNo;
    },
    openUpload() {
      //是否展示班次类型；开班展示，结束隐藏
      if (this.user.awardName != "") {
        this.showUpload = true;
      }else if(this.user.awardName = ""){
        this.showUpload = false;
      }
    },
    getFileNo: function (res) {
      res = aes.decrypt(res)
      if (res.code != '200') {
        return;
      }
      this.user.fileNo = res.data
      this.$message.success('上传成功');
    },
    getClassNo(){
      request.get("/info_account/getByAccountNo?accountNo=" + this.user.accountNo).then(res => {
        if(res.data.code === '200'){
          this.user.classNo = res.data.data.classNo
        }
      })
    },
  }
}

</script>


<style scoped>

</style>
